<template>
  <div class="aMap_wrap">
    <el-amap class="map" vid="aMap" :zoom="zoom" :events="events"></el-amap>
  </div>
</template>

<script>
import { AMapManger, lazyAMapApiLoaderInstance } from "vue-amap";
export default {
  data() {
    const _this = this;
    return {
      map: null,
      zoom: 15,
      events: {
        init(o) {
          lazyAMapApiLoaderInstance.load().then(() => {
            _this.initMap();
          });
        }
      }
    };
  },
  mounted() {
    lazyAMapApiLoaderInstance.load().then(() => {
      this.map = new AMap.Map("aMap", {
        center: ["116.404765", "39.918052"],
        zoom: this.zoom
      });
    });
  },
  methods: {
    initMap() {
      // this.map = amapManager.getMap();
      console.log("initMap");
    }
  }
};
</script>

<style lang="scss" scoped>
.aMap_wrap {
  width: 100%;
  height: 100%;
  // background-color: aqua;
  .map {
    width: 100%;
    height: 100%;
  }
}
</style>